<template>
  <div class="index" :style="{minHeight:$store.state.minHeight+'rem'}">
    <header>
      <div class="storeInfo">
        <div class="shopImg">
          <img :src="$store.state.imgurlApi+store_info.avatar" alt="">
        </div>
        <div class="shopInfo">
          <div>{{config_info[0].value}}</div>
          <div class="shopNum">商户号：{{store_info.id}}</div>
        </div>
        <div class="statue" v-if="config_info[12].value==1">营业中</div>
        <div class="statue" v-else>休息中</div>
      </div>
      <router-link tag="div" class="watch" to="/views/Business/storeInfo">查看门店 ></router-link>
    </header>
    <div class="info">
      <div>
        <div class="number">230</div>
        <div>全部商品</div>
      </div>
      <div class="info_border">
        <div class="number">￥156.00</div>
        <div>今日营业额</div>
      </div>
      <div>
        <div class="number">45</div>
        <div>全部客户</div>
      </div>
    </div>
    <div class="nav_list">
      <router-link to="/views/Business/storeInfo" tag="div" class="nav">
        <div>
          <div class="icon">
            <img src="../../../static/img/business/icon_hom.png" alt="" />
          </div>
          <div class="name">店铺管理</div>
        </div>
      </router-link>
      <router-link to="/views/Business/goodsType" tag="div" class="nav">
        <div>
          <div class="icon">
            <img src="../../../static/img/business/goodsType.png" alt="" />
          </div>
          <div class="name">商品分类</div>
        </div>
      </router-link>
      <router-link to="/views/Business/goodsList" tag="div" class="nav">
        <div>
          <div class="icon">
            <img src="../../../static/img/business/goods.png" alt="" />
          </div>
          <div class="name">商品管理</div>
        </div>
      </router-link>
      <router-link to="/views/Business/order" tag="div" class="nav">
        <div>
          <div class="icon">
            <img src="../../../static/img/business/dingdan.png" alt="" />
          </div>
          <div class="name">订单管理</div>
        </div>
      </router-link>
      <router-link to="/views/Business/commit" tag="div" class="nav">
        <div>
          <div class="icon">
            <img src="../../../static/img/business/pinglun.png" alt="" />
          </div>
          <div class="name">评论管理</div>
        </div>
      </router-link>
      <router-link to="/views/Business/means" tag="div" class="nav">
        <div>
          <div class="icon">
            <img src="../../../static/img/business/zichan.png" alt="" />
          </div>
          <div class="name">我的资产</div>
        </div>
      </router-link>
      <div class="nav">
        <div>
          <div class="icon">
            <img src="../../../static/img/business/saoyisao.png" alt="" />
          </div>
          <div class="name">扫一扫</div>
        </div>
      </div>
      <router-link to="/views/Business/marketing" tag="div" class="nav">
        <div>
          <div class="icon">
            <img src="../../../static/img/business/yingxiao.png" alt="" />
          </div>
          <div class="name">营销活动</div>
        </div>
      </router-link>
      <router-link to="/views/Business/statistics" tag="div" class="nav">
        <div>
          <div class="icon">
            <img src="../../../static/img/business/tongji.png" alt="" />
          </div>
          <div class="name">商户统计</div>
        </div>
      </router-link>
      <router-link to="/views/Business/notice" tag="div" class="nav">
        <div>
          <div class="icon">
            <img src="../../../static/img/business/gonggao.png" alt="" />
          </div>
          <div class="name">公告</div>
        </div>
      </router-link>
    </div>
  </div>
</template>

<script>
    export default {
        name: "index",
      data(){
        return {
          store_id:0,
          store_info:{},
          config_info:[]
        }
      },
      methods:{

      },
      mounted() {
        console.log(this.$store.state.userInfo.token_lt);
        if(this.$store.state.userInfo.token_lt){
          this.$myAxios('store/user/getUserStoreInfo', 'get', {
            token:this.$store.state.userInfo.token_lt
          }).then(res => {
            if(res.data.data){
              this.$store.state.storeInfo = res.data.data;
              this.$myAxios('/store/index/info', 'get', {
                store_id:res.data.data.id
              }).then(data => {
                this.store_info = data.data.data.store_info;
                localStorage.setItem("storeInfo",JSON.stringify(data.data.data.store_info));
                localStorage.setItem("configInfo",JSON.stringify(data.data.data.config_info));
                this.config_info = data.data.data.config_info
              });
              this.store_info = JSON.parse(localStorage.getItem("storeInfo"));
              this.config_info = JSON.parse(localStorage.getItem("configInfo"));
            }else{
              this.$router.push({
                path:"/views/Client/index",
              })
            }
          });
          console.log(this.store_info)
        }else{
          this.$router.push({
            path:"/views/loginBusiness/login",
          })
        }
      }
    }
</script>

<style scoped>
  .index{
    background: #F5F5F5;
    min-height: 6.6rem;
  }
  header{
    width: 100%;
    height: 1.15rem;
    background: linear-gradient(170deg,rgba(251,68,72,1) 0%,rgba(254,111,77,1) 100%);
    color: #ffffff;
  }
  .storeInfo{
    display: flex;
    justify-content: space-between;
    padding: .3rem .21rem .16rem .18rem;
  }
  .shopImg{
    width: .36rem;
    height: .36rem;
    overflow: hidden;
    margin-right: .13rem;
    border-radius: .03rem;
  }
  .shopInfo{
    flex-grow: 1;
    font-size: .15rem;
    font-weight: bold;
  }
  .shopNum{
    font-size: .13rem;
    font-weight: normal;
  }
  .statue{
    width: .7rem;
    height: .33rem;
    border: 1px solid #ffffff;
    border-radius: .05rem;
    text-align: center;
    line-height: .33rem;
    font-size: .15rem;
  }
  .watch{
    text-align: right;
    font-size: .13rem;
    padding-right: .21rem;
  }
  .info{
    display: flex;
    justify-content: center;
    height: .7rem;
    align-items: center;
    background: #ffffff;
  }
  .info>div{
    width: 33%;
    text-align: center;
    color: #333333;
    font-size: .14rem;
  }
  .number{
    font-size: .18rem;
    color: #FE574E;
    line-height: .28rem;
  }
  .info_border{
    border-left: 1px solid #CCCCCC;
    border-right: 1px solid #CCCCCC;
  }
  .nav_list{
    margin-top: .11rem;
    background: #ffffff;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: .2rem;
  }
  .nav{
    width: 33%;
    text-align: center;
    height: 1.1rem;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    border-right: 1px solid #F6F6F6;
    border-bottom: 1px solid #F6F6F6;
    font-size: .14rem;
    color: #333333;
  }
  .nav>div{
    width: 100%;
  }
  .nav .icon{
    width: .22rem;
    margin: 0 auto .05rem;
  }
</style>
